
<template>
  <div id="main2" style="width: 100%;height:100%;">
  </div>
</template>

<script>
import * as echarts from 'echarts'
import { log } from 'console'
export default {
  name: 'Aosa',
  data() {
    return {
      centerDialogVisible: false,
      data: {
        member: ['小1', '小2', '小3', '小4', '小5', '小6', '小7', '小8',],
        num: [10, 20, 30, 50, 60, 40, 20, 20]
      }
    }
  },
  mounted() {
    this.drawLine()
  },
  methods: {
    drawLine() {

      let that = this
      // 基于准备好的dom，初始化echarts实例
      var myChart = echarts.init(document.getElementById('main2'))
      // 绘制图表
      myChart.setOption(
        {
          title: {
            text: '项目成员贡献度',
            left: 'center'
          },
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'cross',
              crossStyle: {
                color: '#999'
              }
            }
          },
          legend: {
            data: ['贡献度'],
            left: 'center',
            top: 'bottom',
          },

          xAxis: [
            {
              type: 'category',
              data: this.data.member,
              axisPointer: {
                type: 'shadow'
              }
            }
          ],
          yAxis: [
            {
              type: 'value',
              name: '贡献度',
              min: 0,
              max: 100,
              interval: 20,
              axisLabel: {
                formatter: '{value}'
              }
            },
          ],
          series: [
            {
              name: '贡献度',
              type: 'bar',
              tooltip: {
                valueFormatter: function (value) {
                  return value;
                }
              },
              data: this.data.num,
              barWidth: 30,
              itemStyle: {
                color: '#00b6ff'
              },
            },
          ]
        }
      )
      myChart.on('click', function (params) {

        that.$emit('callback', [true, params.name])
      })
      window.addEventListener('resize', function () {
        myChart.resize()
      })


    }
  }
}

</script>



